<template>
	<view>
	<!-- 	<u-navbar bgColor='#fff' leftIconColor="#000" @rightClick="rightClick" :rightIcon="rightIcon" :autoBack="true"  >
			 <view
				class="u-nav-slot"
				slot="center">
					<text class="navText">{{data.title}}</text>
			</view>
		</u-navbar> -->
		<view class="toastMsg" v-if="pageType==2">
			<u-icon name="error-circle" label='文章审核失败!' color='#FF7A00' labelColor="#FF7A00" ></u-icon>
		</view>
    <view class="videoBox" v-if="data.diagram.length > 0">
      <image v-for="(item,index) in data.diagram" :src="item" mode="widthFix" :key="index"></image>
    </view>
		<view class="videoBox" v-if="!(data.video==''||data.video==null)">
			<video class="video" id="videoId" title="" :controls="true"  :enable-play-gesture='true' :src="data.video" :poster='data.video_first' :initial-time='0.01'>
			</video>
		</view>
		<view class="newsText">
			<view class="newsTitle">
				{{data.title}}
			</view>
			<view v-if="pageType==0||pageType==4" class="personalMsg">
				<view class="personalMsgImg" >
					<image :src="data.avatar" mode="widthFix"></image>
				</view>
				<view class="time">
					<text>{{data.nickname}}</text>
					<text class="line"></text>
					<text>{{data.createtime}}</text>
				</view>
			</view>
			<view v-else class="personalMsg">
				<view class="time notUser">
					<text>{{data.createtime}}</text>
				</view>
			</view>
			<view class="newsP">
				<u-parse :content="data.content"></u-parse>
			</view>
		</view>
		
		<view v-if="pageType!=0 && pageType!=1 && (pageType!=4 || data.examine)">
			<view class="bottomBtn" style="height: 148rpx;">
				<u-button @click="editEvent" :text="pageType!=4?'编辑':'驳回'" color='#FAFAFA' :hairline='false'></u-button>
				<u-button @click="delEvent" :text="pageType!=4?'删除':'通过'" type="primary" color='#4871C0' :hairline='false'></u-button>
			</view>
			<view style="height: 148rpx;"></view>
		</view>
		
		<u-action-sheet :actions="actionList" :show="actionShow" cancelText='取消'
		 :closeOnClickAction="true"
		 :closeOnClickOverlay="true"
		 round='8'
		 @select='sheetEvent'
		 @close='close'
		 ></u-action-sheet>
		 
		<u-popup :show="showPopup" @close="closePopup" @open="openPopup" mode='center'>
			<view class="popupBox">
				<view class="popupTitle">
					拒绝理由
				</view>
				<view class="popupText">
					<u--textarea v-model="textareaValue" placeholder="请输入拒绝理由" focus confirmType='done' :maxlength='-1' height='200rpx'></u--textarea>
				</view>
				<view class="popupBtn">
					<u-button text="取消" @click="showPopup=false,textareaValue=''"></u-button>
					<u-button text="提交" @click="subimtExamine(3,articleId)"></u-button>
				</view>
			
			</view>
		</u-popup>
	</view>
</template>

<script>
	import {
		articleInfo,
		deleteMeet,
		footprintExamine
	} from '@/api/schoolEventApi.js'
	export default {
		data() {
			return {
				actionList:[
					{
						name:'删除足迹'
					},
				],
				actionShow:false,
				data:{},
				// rightIcon:'',
				articleId:'',
				pageType:0,
				textareaValue:'',
				showPopup:false
			}
		},
		onLoad(options) {
			/* 
				options.pageType => 
				0 新闻列表的详情
				1 自己发布的详情 审核成功   
				2 审核失败的文章详情
				3 草稿箱 
				4 审核人员打开的详情页 
			*/
		   
		   if(options.pageType){
			   this.pageType = options.pageType;
		   }
			
			console.log(options.id);
			this.getArticleInfo(options.id);
			this.articleId = options.id;
			// if(options.isDraft == 1) this.rightIcon = 'more-dot-fill';
		},
		methods: {
			editEvent(){
				if(this.pageType == 2 || this.pageType == 3) {
					uni.navigateTo({
						url: '/pages/tabbar-5-detial/schoolEvent/publishContent/publishContent?id='+this.articleId
					});
				}
				if(this.pageType == 4) this.showPopup = true;
			},
			delEvent(){
				if(this.pageType == 2 || this.pageType == 3) this.sheetEvent()
				if(this.pageType == 4) this.subimtExamine(2,this.articleId);
				
			},
			
			
			// 审核文章
			subimtExamine(status,id){
				this.showPopup = false;	
				let params = {
					article_id: id,
					status: status,
					examineDesc: this.textareaValue
				};
				uni.showLoading({
					title: '提交中'
				});
				footprintExamine(params).then(res => {
					console.log(res)
					uni.hideLoading();
					uni.showToast({
						title: res.msg,
						duration: 1000,
						icon:"none"
					});
					if(res.code == 1) {
						this.textareaValue = '';
						setTimeout(()=>{
							uni.navigateTo({
								url: `/pages/tabbar-5-detial/schoolEvent/newsDetail/newsDetail?pageType=0&id=${this.articleId}`
							});
						},1000)
					}
					
				})
			},
			openPopup(){
							
			},
		
			closePopup(){
				
			},
			rightClick(){
				this.actionShow = true;
			},
			close(){
				this.actionShow = false;
			},
			
			sheetEvent(){
				uni.showModal({
				    title: '删除确认',
				    content: '是否删除该数据？',
					success: (res)=> {
				        if (res.confirm) {
							let params = {
								article_id: this.articleId
							};
							uni.showLoading({
								title: '删除中'
							});
				            deleteMeet(params).then(res => {
								console.log(res)
								uni.hideLoading();
								uni.showToast({
									title: res.msg,
									duration: 1000,
									icon:"none"
								});
								if(res.code == 1){
									setTimeout(()=>{
										uni.navigateBack();
									},1000)
								}
							})
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
			},
			
			getArticleInfo(id){
				let params = {
					article_id:id
				};
				uni.showLoading({
					title: '加载中'
				});
				articleInfo(params).then(res => {
					console.log(res)
					uni.hideLoading();
					this.data = res.data;
					if(res.code != 1){
						uni.showToast({
							title: res.msg,
							duration: 2000,
							icon:"none"
						});
					}
				})
			},
			
		}
	}
</script>

<style>

image{
	width: 100%;
}
.u-nav-slot{
	width: 40%;
	text-align: center;
}
.navText{
	/* width: 50%; */
	overflow: hidden;
	text-overflow: ellipsis;  /* 超出部分省略号 */
	word-break: break-all;  /* break-all(允许在单词内换行。) */  
	display: -webkit-box; /* 对象作为伸缩盒子模型显示 */
	-webkit-box-orient: vertical; /* 设置或检索伸缩盒对象的子元素的排列方式 */
	-webkit-line-clamp: 1; /* 显示的行数 */
	font-weight: 600;
}
.toastMsg{
	height: 88rpx;
	display: flex;
	align-items: center;
	padding-left: 20rpx;
	background-color: #FFF1E3;
}
#videoId{
	width: 100%;
}
.videoBox{
	width: 100%;
}
.newsText{
	padding: 30rpx 24rpx 0rpx 24rpx;
}
.newsTitle{
	font-weight: 600;
	line-height: 50rpx;
}
.newsTime{
	margin-top: 20rpx;
	color: #aaa;
	font-size: 28rpx;
}
.newsP{
	line-height: 50rpx;
	margin-top: 40rpx;
}
.newsP text{
	text-indent: 2rem;
	display: block;
}

.personalMsg{
	display: flex;
	align-items: center;
	margin-top: 20rpx;
}
.personalMsgImg{
	width: 36rpx;
	height: 36rpx;
	border-radius: 50%;
	overflow: hidden;
	background-color: #F8F8F8;
}
.line{
	margin: 0 16rpx;
	width: 2rpx;
	height: 20rpx;
	background-color: #aaa;
	display: inline-block;
}
.time{
	color: #aaa;
	font-size: 28rpx;
	/* padding-left: 28rpx; */
	margin-left: 10rpx;
}
.notUser{
	margin-left: 0;
}
.bottomBtn{
	width: 100%;
	height:148rpx;
	background-color: #fff;
	position: fixed;
	bottom: 0;
	z-index: 999;
	display: flex;
	align-items: center;
}
.bottomBtn /deep/.u-button--square{
	width: 40%;
}
.bottomBtn /deep/.u-button--normal:first-child .u-button__text{
	color: #333;
}
.bottomBtn /deep/uni-button:after{
	border: none;
}


.popupBox{
	width: 640rpx;
	/* height: 460rpx; */
	background-color: #FFFFFF;
	border-radius: 16rpx;
	overflow: hidden;
	position: fixed;
	top: 50%;
	left: 50%;
	/* z-index: 99; */
	transform: translate(-50%,-50%);
}
.popupTitle{
	font-weight: 600;
	text-align: center;
	padding: 32rpx 0;
	font-size: 38rpx;
}
.popupText{
	padding: 0 24rpx;
}
.popupText /deep/.u-textarea{
	background-color: #F8F8F8;
}
.popupBtn{
	display: flex;
	margin-top: 40rpx;
	/* padding: 20rpx 0; */
	background-color: #fff;
	border-radius: 16rpx;
}
.popupBox /deep/.u-button--info{
	border: none;
	border-radius: 0;
	padding: 50rpx 0;
}
.popupBox /deep/uni-button:last-child:after{
	border-left: none;
}
.popupBox /deep/uni-button:after{
	border-radius: 0;
}
.popupBox /deep/.u-button__text{
	font-size: 32rpx !important;
	font-weight: 600;
}
.popupBox /deep/.u-button--info:last-child .u-button__text{
	color: #1050e3;
}
</style>
